import React from "react";
import './index.css'

export default function FitListModal({ title, type, dataList, onItemClick, onCloseClick }) {

    return (
        <div className="fitListModalRoot">
            <div className="fitListModalTransparent"></div>
            <div className="fitListModalContent">
                <h2 className="fitListModalTitle">{title}</h2>
                <div className="fitListModalList">
                    {dataList.map((value, index) => {
                        return (
                            <div className="fitListModalListRow"
                                key={index}
                                onClick={() => onItemClick(type, dataList[index])}>
                                <span className="fitListModalListTitle">{dataList[index].title}</span>
                                <div className="fitListModalListLine"></div>
                            </div>
                        )
                    })}
                </div>
                <button onClick={onCloseClick}>Close</button>
            </div>
        </div>
    )
}